<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Flatpoint - Responsive Web App Template</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
    <link href="css/stylesheet.css" rel="stylesheet">
    <link href="icon/font-awesome.css" rel="stylesheet">
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>

    <!-- Le fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/apple-touch-icon-144-precomposed.html">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/apple-touch-icon-114-precomposed.html">
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/apple-touch-icon-72-precomposed.html">
                    <link rel="apple-touch-icon-precomposed" href="img/apple-touch-icon-57-precomposed.html">
                                   <link rel="shortcut icon" href="img/favicon.png">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
    <![endif]-->
  </head>

  <body>

    <header class="dark_grey"> <!-- Header start -->
        <a href="#" class="logo_image"><span class="hidden-480">FlatPoint</span></a>
        <ul class="header_actions pull-left hidden-480 hidden-768">
            <li rel="tooltip" data-placement="bottom" title="Hide/Show main navigation" ><a href="#" class="hide_navigation"><i class="icon-chevron-left"></i></a></li>
            <li rel="tooltip" data-placement="right" title="Change navigation color scheme" class="color_pick navigation_color_pick"><a class="iconic" href="#"><i class="icon-th"></i></a>
                <ul>
                    <li><a class="blue" href="#"></a></li>
                    <li><a class="light_blue" href="#"></a></li>
                    <li><a class="grey" href="#"></a></li>
                    <li><a class="dark_grey" href="#"></a></li>
                    <li><a class="pink" href="#"></a></li>
                    <li><a class="red" href="#"></a></li>
                    <li><a class="orange" href="#"></a></li>
                    <li><a class="yellow" href="#"></a></li>
                    <li><a class="green" href="#"></a></li>
                    <li><a class="dark_green" href="#"></a></li>
                    <li><a class="turq" href="#"></a></li>
                    <li><a class="dark_turq" href="#"></a></li>
                    <li><a class="purple" href="#"></a></li>
                    <li><a class="violet" href="#"></a></li>
                    <li><a class="dark_blue" href="#"></a></li>
                    <li><a class="dark_red" href="#"></a></li>
                    <li><a class="brown" href="#"></a></li>
                    <li><a class="black" href="#"></a></li>
                    <a class="dark_navigation" href="#">Dark navigation</a>
                </ul>
            </li>
        </ul>
        <ul class="header_actions">
            <li rel="tooltip" data-placement="left" title="Header color scheme" class="color_pick header_color_pick hidden-480"><a class="iconic" href="#"><i class="icon-th"></i></a>
                <ul>
                    <li><a class="blue set_color" href="#"></a></li>
                    <li><a class="light_blue set_color" href="#"></a></li>
                    <li><a class="grey set_color" href="#"></a></li>
                    <li><a class="dark_grey set_color" href="#"></a></li>
                    <li><a class="pink set_color" href="#"></a></li>
                    <li><a class="red set_color" href="#"></a></li>
                    <li><a class="orange set_color" href="#"></a></li>
                    <li><a class="yellow set_color" href="#"></a></li>
                    <li><a class="green set_color" href="#"></a></li>
                    <li><a class="dark_green set_color" href="#"></a></li>
                    <li><a class="turq set_color" href="#"></a></li>
                    <li><a class="dark_turq set_color" href="#"></a></li>
                    <li><a class="purple set_color" href="#"></a></li>
                    <li><a class="violet set_color" href="#"></a></li>
                    <li><a class="dark_blue set_color" href="#"></a></li>
                    <li><a class="dark_red set_color" href="#"></a></li>
                    <li><a class="brown set_color" href="#"></a></li>
                    <li><a class="black set_color" href="#"></a></li>
                </ul>
            </li>
            <li rel="tooltip" data-placement="bottom" title="2 new messages" class="messages"><a class="iconic" href="#"><i class="icon-envelope-alt"></i> 2</a>
                <ul class="dropdown-menu pull-right messages_dropdown">
                    <li>
                        <a href="#">
                            <img src="demo/avatar_06.png" alt="">
                            <div class="details">
                                <div class="name">Jane Doe</div>
                                <div class="message">
                                    Lorem ipsum Commodo quis nisi...
                                </div>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="demo/avatar_05.png" alt="">
                            <div class="details">
                                <div class="name">Jane Doe</div>
                                <div class="message">
                                    Lorem ipsum Commodo quis nisi...
                                </div>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="demo/avatar_04.png" alt="">
                            <div class="details">
                                <div class="name">Jane Doe</div>
                                <div class="message">
                                    Lorem ipsum Commodo quis nisi...
                                </div>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="demo/avatar_05.png" alt="">
                            <div class="details">
                                <div class="name">Jane Doe</div>
                                <div class="message">
                                    Lorem ipsum Commodo quis nisi...
                                </div>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="demo/avatar_06.png" alt="">
                            <div class="details">
                                <div class="name">Jane Doe</div>
                                <div class="message">
                                    Lorem ipsum Commodo quis nisi...
                                </div>
                            </div>
                        </a>
                    </li>
                    <a href="#" class="btn btn-block blue align_left"><span>Messages center</span></a>
                </ul>
            </li>
            <li class="dropdown"><a href="#"><img src="demo/avatar_06.png" alt="User image" class="avatar"> Bernad Delic <i class="icon-angle-down"></i></a>
                <ul>
                    <li><a href="#"><i class="icon-cog"></i> User options</a></li>
                    <li><a href="#"><i class="icon-inbox"></i> Messages</a></li>
                    <li><a href="#"><i class="icon-user"></i> Friends</a></li>
                    <li><a href="#"><i class="icon-remove"></i> Logout</a></li>
                </ul>
            </li>
            <li><a href="#"><i class="icon-signout"></i> <span class="hidden-768 hidden-480">Logout</span></a></li>
            <li class="responsive_menu"><a class="iconic" href="#"><i class="icon-reorder"></i></a></li>
        </ul>
    </header>

    <div id="main_navigation" class="dark_grey"> <!-- Main navigation start -->
        <div class="inner_navigation">
            <ul class="main">
                <li><a href="dashboard.html"><i class="icon-home"></i> Dashboard</a>
                    <ul class="sub_main">
                        <li><a href="index-2.html">Dashboard</a></li>
                        <li><a href="dashboard_2.html">Dashboard multimedia</a></li>
                        <li><a href="dashboard_3.html">Dashboard no sidebar</a></li>
                        <li><a href="dashboard_relative.html">Dashboard relative header</a></li>
                        <li><a href="dashboard_4.html">Dashboard top navigation</a></li>
                        <li><a href="dashboard_5.html">Dashboard fixed</a></li>
                    </ul>
                </li>
                <li><a href="#"><i class="icon-reorder"></i> Forms</a>
                    <ul class="sub_main">
                        <li><a href="forms.html">Form elements</a></li>
                        <li><a href="forms_advanced.html">Forms advanced</a></li>
                        <li><a href="forms_layout.html">Forms layout</a></li>
                        <li><a href="forms_wizard.html">Form wizards</a></li>
                        <li><a href="forms_validation.html">Form validation</a></li>
                    </ul>
                </li>
                <li><a href="#"><i class="icon-tasks"></i> Components</a>
                    <ul class="sub_main">
                        <li><a href="component_navigation.html">Only main navigation</a></li>
                        <li><a href="component_sidebar.html">Only sidebar</a></li>
                        <li><a href="component_top_navigation.html">Only top navigation</a></li>
                        <li><a href="component_full_width.html">Full width page</a></li>
                        <li><a href="blank.html">Blank page</a></li>
                    </ul>
                </li>
                <li class="active navAct"><a class="expand" id="current" href="#"><i class="icon-tasks"></i> UI elements</a>
                    <ul class="sub_main">
                        <li><a href="ui_draggable_boxes.html">Drag & drop boxes</a></li>
                        <li><a href="ui_buttons.html">Buttons</a></li>
                        <li class="active"><a href="ui_bootstrap_elements.html">Bootstrap elements</a></li>
                        <li><a href="ui_tabs.html">Bootstrap tabs</a></li>
                        <li><a href="ui_sliders.html">UI sliders</a></li>
                        <li><a href="ui_typography.html">UI typography</a></li>
                        <li><a href="ui_gallery.html">Gallery</a></li>
                        <li><a href="ui_file_manager.html">File manager</a></li>
                    </ul>
                </li>
                <li><a href="page_calendar.html"><i class="icon-calendar"></i> Calendar</a></li>
                <li><a href="page_statistics.html"><i class="icon-signal"></i> Charts & graphs</a></li>
                <li><a href="#"><i class="icon-table"></i> Tables</a>
                    <ul class="sub_main">
                        <li><a href="tables_basic.html">Basic tables</a></li>
                        <li><a href="tables_responsive.html">Responsive tables <span class="label label-important">New!</span></a></li>
                        <li><a href="tables_datatables.html">Datatables</a></li>
                    </ul>
                </li>
                <li><a href="#"><i class="icon-warning-sign"></i> Error pages</a>
                    <ul class="sub_main">
                        <li><a href="error_404.html">404</a></li>
                        <li><a href="error_405.html">405</a></li>
                        <li><a href="error_406.html">406</a></li>
                        <li><a href="error_406.html">500</a></li>
                        <li><a href="error_406.html">502</a></li>
                    </ul>
                </li>
                <li><a href="#"><i class="icon-lock"></i> Login pages</a>
                    <ul class="sub_main">
                        <li><a href="login.html">Basic login</a></li>
                        <li><a href="login-dark-bg.html">Login dark background</a></li>
                        <li><a href="login-v4.html">Login blue background</a></li>
                        <li><a href="login-white-bg.html">Login white background</a></li>
                        <li><a href="login-v2.html">Login slide background</a></li>
                        <li><a href="login-v3.html">Login slide background opacity</a></li>
                    </ul>
                </li>
                <li><a href="#"><i class="icon-indent-right"></i> Example pages</a>
                    <ul class="sub_main">
                        <li><a href="page_faq.html">FAQ</a></li>
                        <li><a href="page_invoice.html">Invoice</a></li>
                        <li><a href="page_maps.html">Maps</a></li>
                        <li><a href="page_messages_center.html">Messages center</a></li>
                        <li><a href="page_price_tables.html">Pricing tables</a></li>
                        <li><a href="page_profile.html">User profile</a></li>
                        <li><a href="page_search.html">Serach results</a></li>
                        <li><a href="page_timeline.html">Timeline</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>

    <div id="content"> <!-- Content start -->
        <div class="top_bar">
            <ul class="breadcrumb">
              <li><a href="dashboard.html"><i class="icon-home"></i></a> <span class="divider">/</span></li>
              <li class="active"><a href="#">UI</a></li>
            </ul>
        </div>

        <div class="inner_content">
            <div class="statistic clearfix">
                <div class="current_page float_left">
                    <span><i class="icon-reorder"></i> UI Bootstrap elements</span>
                </div>

                <div class="charts clearfix">
                    <ul class="bars_vertical float_right">
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                    </ul>

                    <ul class="bars_vertical float_right">
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="orange"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                        <li><span class="green"></span></li>
                    </ul>
                </div>
            </div>

            <div class="user_bar">
                <div class="row-fluid">
                    <div class="span6 no-search">
                        <select class="chosen">
                            <option>Show all results</option>
                            <option>Show results</option>
                            <option>Show another results</option>
                            <option>Only mine</option>
                            <option>Display none</option>
                        </select>
                    </div>

                    <div class="span6">
                        <div class="search">
                            <input type="text" data-provide="typeahead" name="search" class="typehead span8" placeholder="Search for something" data-source='["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]'>
                            <button type="submit" class="square-button color-green"><i class="icon-plus"></i></button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="widgets_area">

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well grey">
                            <div class="well-header">
                                <h5>Bootstrap modals</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <a href="#myModal" role="button" class="btn red" data-toggle="modal">Launch demo modal</a>
                                <a href="#myModal2" role="button" class="btn blue" data-toggle="modal">Launch demo modal #2</a>
                                <a href="#myModal3" role="button" class="btn turq" data-toggle="modal">Demo modal - no backdrop</a>
                                <a href="#myModal4" role="button" class="btn orange" data-toggle="modal">Modal without animation</a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well grey">
                            <div class="well-header">
                                <h5>Bootstrap extended modals</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <a href="#responsive" role="button" class="btn red" data-toggle="modal">Launch demo modal</a>
                                <a href="#stack1" role="button" class="btn blue" data-toggle="modal">Launch demo modal #2</a>
                                <a href="#static" role="button" class="btn turq" data-toggle="modal">Demo modal - static</a>
                                <a href="#full-width" role="button" class="btn orange" data-toggle="modal">Modal full width</a>
                                <a href="#long" role="button" class="btn brown" data-toggle="modal">Modal long</a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well turq">
                            <div class="well-header">
                                <h5>Bootstrap popovers</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <a href="#" rel="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on left" class="btn red">Popover on left</a>
                                <a href="#" rel="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on top" class="btn blue">Popover on top</a>
                                <a href="#" rel="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on bottom" class="btn turq">Popover on bottom</a>
                                <a href="#" rel="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on right" class="btn orange">Popover on right</a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="alert alert-success">
                    <button type="button" class="close" data-dismiss="alert"><i class="icon-remove"></i></button>
                    <strong>Well done!</strong><br> You successfully read this...
                </div>

                <div class="alert">
                    <button type="button" class="close" data-dismiss="alert"><i class="icon-remove"></i></button>
                    <strong>Warning!</strong><br> Best check yo self...
                </div>

                <div class="alert alert-error">
                    <button type="button" class="close" data-dismiss="alert"><i class="icon-remove"></i></button>
                    <strong>Oh snap!</strong><br> Change a few things up...
                </div>

                <div class="alert alert-info">
                    <button type="button" class="close" data-dismiss="alert"><i class="icon-remove"></i></button>
                    <strong>Heads up!</strong><br> This alert needs your attention.
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well grey">
                            <div class="well-header">
                                <h5>Progress bars</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <div class="progress">
                                    <div class="bar" style="width: 20%;"></div>
                                </div>
                                <div class="progress progress-success">
                                    <div class="bar" style="width: 40%;"></div>
                                </div>
                                <div class="progress progress-info">
                                    <div class="bar" style="width: 60%;"></div>
                                </div>
                                <div class="progress progress-danger">
                                    <div class="bar" style="width: 80%;"></div>
                                </div>
                                <div class="progress progress-warning">
                                    <div class="bar" style="width: 60%;"></div>
                                </div>

                                <div class="progress progress-striped">
                                    <div class="bar" style="width: 20%;"></div>
                                </div>
                                <div class="progress progress-striped progress-success">
                                    <div class="bar" style="width: 40%;"></div>
                                </div>
                                <div class="progress progress-striped progress-info">
                                    <div class="bar" style="width: 60%;"></div>
                                </div>
                                <div class="progress progress-striped progress-danger">
                                    <div class="bar" style="width: 80%;"></div>
                                </div>
                                <div class="progress progress-striped progress-warning">
                                    <div class="bar" style="width: 60%;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span4">
                        <div class="well grey">
                            <div class="well-header">
                                <h5>Pagination large</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <div class="pagination pagination-large">
                                    <ul>
                                        <li><a href="#">Prev</a></li>
                                        <li><a href="#">1</a></li>
                                        <li><a href="#">2</a></li>
                                        <li><a href="#">3</a></li>
                                        <li><a href="#">4</a></li>
                                        <li><a href="#">5</a></li>
                                        <li><a href="#">Next</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="span4">
                        <div class="well blue">
                            <div class="well-header">
                                <h5>Pagination</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <div class="pagination">
                                    <ul>
                                        <li><a href="#">Prev</a></li>
                                        <li><a href="#">1</a></li>
                                        <li><a href="#">2</a></li>
                                        <li><a href="#">3</a></li>
                                        <li><a href="#">4</a></li>
                                        <li><a href="#">5</a></li>
                                        <li><a href="#">Next</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="span4">
                        <div class="well red">
                            <div class="well-header">
                                <h5>Pagination small</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content align_center">
                                <div class="pagination pagination-small">
                                    <ul>
                                        <li><a href="#">Prev</a></li>
                                        <li><a href="#">1</a></li>
                                        <li><a href="#">2</a></li>
                                        <li><a href="#">3</a></li>
                                        <li><a href="#">4</a></li>
                                        <li><a href="#">5</a></li>
                                        <li><a href="#">Next</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well yellow">
                            <div class="well-header">
                                <h5>Breadcrumbs</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content">
                                <ul class="breadcrumb">
                                    <li><a href="#">Home</a> <span class="divider">/</span></li>
                                    <li><a href="#">Library</a> <span class="divider">/</span></li>
                                    <li class="active">Data</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well brown">
                            <div class="well-header">
                                <h5>Navbar</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content">
                                <div class="navbar">
                                    <div class="navbar-inner">
                                        <a class="brand" href="#">Title</a>
                                        <ul class="nav pull-left">
                                            <li class="divider-vertical"></li>
                                            <li class="active"><a href="#">Home</a></li>
                                            <li class="divider-vertical"></li>
                                            <li><a href="#">Link</a></li>
                                            <li class="divider-vertical"></li>
                                            <li><a href="#">Link</a></li>
                                            <li class="divider-vertical"></li>
                                        </ul>

                                        <ul class="nav pull-right">
                                            <li class="active"><a href="#">Right</a></li>
                                            <li><a href="#">Links</a></li>
                                        </ul>
                                    </div>
                                </div>

                                <div class="navbar navbar-inverse">
                                    <div class="navbar-inner">
                                        <a class="brand" href="#">Title</a>
                                        <ul class="nav pull-left">
                                            <li class="divider-vertical"></li>
                                            <li class="active"><a href="#">Home</a></li>
                                            <li class="divider-vertical"></li>
                                            <li><a href="#">Link</a></li>
                                            <li class="divider-vertical"></li>
                                            <li><a href="#">Link</a></li>
                                            <li class="divider-vertical"></li>
                                        </ul>

                                        <ul class="nav pull-right">
                                            <li class="active"><a href="#">Right</a></li>
                                            <li><a href="#">Links</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well orange">
                            <div class="well-header">
                                <h5>Navbar</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content">
                                <div class="navbar">
                                    <div class="navbar-inner">
                                        <form class="navbar-form pull-left">
                                            <input type="text">
                                            <button type="submit" class="btn red">Submit</button>
                                        </form>
                                    </div>
                                </div>

                                <div class="navbar">
                                    <div class="navbar-inner">
                                        <form class="navbar-search pull-left">
                                            <input type="text" class="search-query" placeholder="Search">
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well light_blue">
                            <div class="well-header">
                                <h5>Nav</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content">
                                <ul class="nav nav-tabs">
                                    <li class="active">
                                        <a href="#">Home</a>
                                    </li>
                                    <li><a href="#">Articles</a></li>
                                    <li><a href="#">Simple navigation</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row-fluid">
                    <div class="span12">
                        <div class="well green">
                            <div class="well-header">
                                <h5>Basic pills</h5>
                                <ul>
                                    <li class="color_pick"><a href="#"><i class="icon-th"></i></a>
                                        <ul>
                                            <li><a class="blue set_color" href="#"></a></li>
                                            <li><a class="light_blue set_color" href="#"></a></li>
                                            <li><a class="grey set_color" href="#"></a></li>
                                            <li><a class="pink set_color" href="#"></a></li>
                                            <li><a class="red set_color" href="#"></a></li>
                                            <li><a class="orange set_color" href="#"></a></li>
                                            <li><a class="yellow set_color" href="#"></a></li>
                                            <li><a class="green set_color" href="#"></a></li>
                                            <li><a class="dark_green set_color" href="#"></a></li>
                                            <li><a class="turq set_color" href="#"></a></li>
                                            <li><a class="dark_turq set_color" href="#"></a></li>
                                            <li><a class="purple set_color" href="#"></a></li>
                                            <li><a class="violet set_color" href="#"></a></li>
                                            <li><a class="dark_blue set_color" href="#"></a></li>
                                            <li><a class="dark_red set_color" href="#"></a></li>
                                            <li><a class="brown set_color" href="#"></a></li>
                                            <li><a class="black set_color" href="#"></a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>

                            <div class="well-content">
                                <ul class="nav nav-pills">
                                    <li class="active">
                                        <a href="#">Home</a>
                                    </li>
                                    <li><a href="#">Articles</a></li>
                                    <li><a href="#">Simple navigation</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>Modal header</h3>
        </div>
        <div class="modal-body">
            <p>This is simple modal with animation…</p>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
            <a href="#" class="btn red">Save changes</a>
        </div>
    </div>

    <div id="myModal2" class="modal hide fade" tabindex="-1" data-backdrop="static" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>Modal header</h3>
        </div>
        <div class="modal-body">
            <p>Try to click around modal and you will notice it will not close... Modal-backdrop is static and you have to click on x to close modal!</p>
        </div>
        <div class="modal-footer">
            <a href="#" class="btn dark_green">Save changes</a>
        </div>
    </div>

    <div id="myModal3" class="modal hide fade" tabindex="-1" data-backdrop="false" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h5 id="myModalLabel">Modal header</h5>
        </div>
        <div class="modal-body">
            <p>No backdrop overlay…</p>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
            <a href="#" class="btn red">Save changes</a>
        </div>
    </div>

    <div id="myModal4" class="modal hide toggle" tabindex="-1" data-backdrop="false" toggle="true" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h5 id="myModalLabel">Modal header</h5>
        </div>
        <div class="modal-body">
            <p>No animation on this modal…</p>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
            <a href="#" class="btn red">Save changes</a>
        </div>
    </div>

    <!-- Extended modals -->

    <div id="responsive" class="modal hide fade" tabindex="-1" data-width="760">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>Responsive</h3>
        </div>
        <div class="modal-body">
            <div class="row-fluid">
            <div class="span6">
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
            </div>
            <div class="span6">
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
                <div class="form_row">
                    <label class="field_name">Input label</label>
                    <div class="field">
                        <input type="text" class="span12" name="small">
                    </div>
                </div>
            </div>
            </div>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
            <a href="#" class="btn red">Save changes</a>
        </div>
    </div>

    <div id="stack1" class="modal hide fade" tabindex="-1" data-focus-on="input:first">
        <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
                <h3>Stack One</h3>
            </div>
            <div class="modal-body">
                <p>One fine body…</p>
                <p>One fine body…</p>
                <p>One fine body…</p>
                <input type="text" data-tabindex="1">
                <input type="text" data-tabindex="2">
                <button class="btn grey" data-toggle="modal" href="#stack2">Launch modal</button>
            </div>
            <div class="modal-footer">
                <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
                <a href="#" class="btn red">Save changes</a>
            </div>
        </div>
         
        <div id="stack2" class="modal hide fade" tabindex="-1" data-focus-on="input:first">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
                <h3>Stack Two</h3>
            </div>
            <div class="modal-body">
                <p>One fine body…</p>
                <p>One fine body…</p>
                <input type="text" data-tabindex="1">
                <input type="text" data-tabindex="2">
                <button class="btn grey" data-toggle="modal" href="#stack3">Launch modal</button>
            </div>
            <div class="modal-footer">
                <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
                <a href="#" class="btn red">Save changes</a>
            </div>
        </div>
         
        <div id="stack3" class="modal hide fade" tabindex="-1" data-focus-on="input:first">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
                <h3>Stack Three</h3>
            </div>
            <div class="modal-body">
                <p>One fine body…</p>
                <input type="text" data-tabindex="1">
                <input type="text" data-tabindex="2">
            </div>
            <div class="modal-footer">
                <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
                <a href="#" class="btn red">Save changes</a>
            </div>
        </div>
    </div>

    <div id="static" class="modal hide fade" tabindex="-1" data-backdrop="static" data-keyboard="false">
        <div class="modal-body">
            <p>Would you like to continue with some arbitrary task?</p>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
            <a href="#" class="btn red">Save changes</a>
        </div>
    </div>

    <div id="full-width" class="modal container hide fade" tabindex="-1">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>Full Width</h3>
        </div>
        <div class="modal-body">
            <p>This modal will resize itself to the same dimensions as the container class.</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin ipsum ac ante fermentum suscipit. In ac augue non purus accumsan lobortis id sed nibh. Nunc egestas hendrerit ipsum, et porttitor augue volutpat non. Aliquam erat volutpat. Vestibulum scelerisque lobortis pulvinar. Aenean hendrerit risus neque, eget tincidunt leo. Vestibulum est tortor, commodo nec cursus nec, vestibulum vel nibh. Morbi elit magna, ornare placerat euismod semper, dignissim vel odio. Phasellus elementum quam eu ipsum euismod pretium.</p>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
            <a href="#" class="btn red">Save changes</a>
        </div>
    </div>

    <div id="long" class="modal hide fade" tabindex="-1" data-replace="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>A Fairly Long Modal</h3>
        </div>
        <div class="modal-body">
            <button class="btn grey" data-toggle="modal" href="#notlong" style="position: absolute; top: 50%; right: 12px">Not So Long Modal</button>
            <img style="height: 800px" src="../../i.imgur.com/KwPYo.jpg">
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
        </div>
    </div>

    <div id="notlong" class="modal hide fade" tabindex="-1" data-replace="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>Not That Long</h3>
        </div>
        <div class="modal-body">
            <button class="btn grey" data-toggle="modal" href="#verylong" style="position: absolute; top: 50%; right: 12px">Very Long Modal</button>
            <div style="height: 400px; overflow: hidden;">
              <img style="height: 800px" src="../../i.imgur.com/KwPYo.jpg" />
            </div>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
        </div>
    </div>

    <div id="verylong" class="modal hide fade" tabindex="-1" data-replace="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></button>
            <h3>A Very Long</h3>
        </div>
        <div class="modal-body">
            <div style="height: 1000px; overflow: hidden;">
              <img style="height: 800px" src="../../i.imgur.com/KwPYo.jpg" />
            </div>
        </div>
        <div class="modal-footer">
            <a href="#" data-dismiss="modal" aria-hidden="true" class="btn grey">Close</a>
        </div>
    </div>

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery-1.10.2.js"></script>
    <script src="js/jquery-ui-1.10.3.js"></script>
    <script src="js/bootstrap.js"></script>

    <script src="js/library/jquery.collapsible.min.js"></script>
    <script src="js/library/jquery.mCustomScrollbar.min.js"></script>
    <script src="js/library/jquery.mousewheel.min.js"></script>
    <script src="js/library/jquery.uniform.min.js"></script>

    <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCL6XtCGot7S7cfxnO6tRfeZx9kLQQRMtA&amp;sensor=false"></script>
    <script src="js/library/jquery.sparkline.min.js"></script>
    <script src="js/library/chosen.jquery.min.js"></script>
    <script src="js/library/jquery.easytabs.js"></script>
    <script src="js/library/flot/excanvas.min.js"></script>
    <script src="js/library/flot/jquery.flot.js"></script>
    <script src="js/library/flot/jquery.flot.pie.js"></script>
    <script src="js/library/flot/jquery.flot.selection.js"></script>
    <script src="js/library/flot/jquery.flot.resize.js"></script>
    <script src="js/library/flot/jquery.flot.orderBars.js"></script>
    <script src="js/library/maps/jquery.vmap.js"></script>
    <script src="js/library/maps/maps/jquery.vmap.world.js"></script>
    <script src="js/library/maps/data/jquery.vmap.sampledata.js"></script>
    <script src="js/library/jquery.autosize-min.js"></script>
    <script src="js/library/charCount.js"></script>
    <script src="js/library/jquery.minicolors.js"></script>
    <script src="js/library/jquery.tagsinput.js"></script>
    <script src="js/library/fullcalendar.min.js"></script>
    <script src="js/library/footable/footable.js"></script>
    <script src="js/library/footable/data-generator.js"></script>

    <script src="js/library/bootstrap-datetimepicker.js"></script>
    <script src="js/library/bootstrap-timepicker.js"></script>
    <script src="js/library/bootstrap-datepicker.js"></script>
    <script src="js/library/bootstrap-fileupload.js"></script>
    <script src="js/library/jquery.inputmask.bundle.js"></script>

    <script src="js/library/bootstrap-modal.js"></script>
    <script src="js/library/bootstrap-modalmanager.js"></script>

    <script src="js/flatpoint_core.js"></script>

    <script src="js/forms.js"></script>

  </body>
</html>
